<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:body>
	<ui:composition template="/template/common/commonLayout.xhtml">

		<ui:define name="content">


			<h:panelGrid>

				<p:dataTable id="table" var="timeTableElement"
					value="#{timeTableBean.tteTableDataModel}"
					style="width: 100%"  scrollHeight="300"
					scrollable="true">


					<p:column headerText="Train">  
                   #{timeTableElement.train.number}  
               </p:column>

					<p:column headerText="Departure station">  
                   #{timeTableElement.departureStation.name}  
               </p:column>

					<p:column headerText="Departure Date">
						<h:outputText value="#{timeTableElement.departureTime}">
							<f:convertDateTime pattern="dd.MM.yyyy HH:mm" />
						</h:outputText>
					</p:column>


					<p:column headerText="Arrival station">  
                   #{timeTableElement.arrivalStation.name}  
               </p:column>

					<p:column headerText="Arrival Date">
						<h:outputText value="#{timeTableElement.arrivalTime}">
							<f:convertDateTime pattern="dd.MM.yyyy HH:mm" />
						</h:outputText>


					</p:column>



					<f:facet name="footer">

						<h:panelGrid>
							<p:row >
								<p:column >
									<h:panelGrid columns="2">
							
							    Select filter by departure station:
								<p:selectOneMenu value="#{timeTableBean.departureStationFilter}"
											converter="stationConverter" effect="fade" var="s"
											filter="true" filterMatchMode="startsWith">
											<p:ajax update="table"
												listener="#{timeTableBean.filterTimeTable()}" />
											<f:selectItem itemLabel="All" itemValue="" />
											<f:selectItems value="#{timeTableBean.stations}"
												var="station" itemValue="#{station}"
												itemLabel="#{station.name}" />


											<p:column>
                                              #{s.name}
                                            </p:column>
										</p:selectOneMenu>
									</h:panelGrid>
								</p:column>
								
								<p:column >
									<p:commandButton id="addButton" value="Add"
										rendered="#{userBean.getRole() == 'EMPLOYEE' }"
										icon="ui-icon-circle-plus" oncomplete="addTTEDialog.show()" />
								</p:column>
							</p:row>
						</h:panelGrid>

					</f:facet>
				</p:dataTable>
			</h:panelGrid>
			<p:dialog header="Add element in timetable" widgetVar="addTTEDialog"
				resizable="false" showEffect="clip" hideEffect="fold">
				<h:panelGrid columns="2" cellspacing="8">  
			Select Train: 
		  			<p:selectOneMenu value="#{timeTableBean.trainSelected}"
						converter="trainConverter" effect="fade" var="t" filter="true"
						filterMatchMode="startsWith">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{timeTableBean.trains}" var="train"
							itemValue="#{train}" itemLabel="#{train.number}" />


						<p:column>
                          #{t.number}
                        
						</p:column>


					</p:selectOneMenu>
					Select departure station:
					<p:selectOneMenu value="#{timeTableBean.departureStation}"
						converter="stationConverter" effect="fade" var="s" filter="true"
						filterMatchMode="startsWith">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{timeTableBean.stations}" var="station"
							itemValue="#{station}" itemLabel="#{station.name}" />


						<p:column>
                          #{s.name}
                         
						</p:column>
					</p:selectOneMenu>
					Select arrival station:
					<p:selectOneMenu value="#{timeTableBean.arrivalStation}"
						converter="stationConverter" effect="fade" var="s" filter="true"
						filterMatchMode="startsWith">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{timeTableBean.stations}" var="station"
							itemValue="#{station}" itemLabel="#{station.name}" />


						<p:column>
                          #{s.name}
                         
						</p:column>
					</p:selectOneMenu>
					
					
					Select departure time
					<p:calendar value="#{timeTableBean.departureTime}"
						pattern="MM/dd/yyyy HH:mm" /> 
					
					Select arrival time
					<p:calendar value="#{timeTableBean.arrivalTime}"
						pattern="MM/dd/yyyy HH:mm" />




					<p:commandButton value="Add" action="#{timeTableBean.addTTE()}"
						onclick="addTTEDialog.hide()" update="table" />
					<p:commandButton value="Cancel" onclick="addTTEDialog.hide()" />

				</h:panelGrid>
			</p:dialog>

		</ui:define>

	</ui:composition>

</h:body>
</html>